/**
 * Created by wuyunan on 2017/5/19.
 */
import React from "react";

import PropTypes from "prop-types";
import {
  StyleSheet, Text, TouchableOpacity, SafeAreaView,
} from "react-native";
import { Color, FontSize, isIOS } from "../../common/index";

const TitleBarText = props => {
  const onPress = () => {
    props.onPress();
  };

  return (
    <SafeAreaView style={{ flexDirection: "row" }}>
      <TouchableOpacity
        onPress={() => onPress()}
        disabled={props.disabled}
        style={[styles.container, { paddingVertical: props.paddingVertical }]}
      >
        <Text
          style={[
            styles.text,
            {
              color: props.color,
              fontSize: props.fontSize,
            },
          ]}
        >
          {props.text}
        </Text>
      </TouchableOpacity>
    </SafeAreaView>
  );
};
TitleBarText.defaultProps = {
  color: Color.white,
  fontSize: FontSize.SIZE_16,
  disabled: false,
  paddingVertical: isIOS ? 10 : 21,
};
TitleBarText.propsTypes = {
  text: PropTypes.string,
  onPress: () => {},
  disabled: PropTypes.bool,
  color: Text.propTypes.color,
  fontSize: Text.propTypes.fontSize,
  paddingVertical: PropTypes.number,
};
const styles = StyleSheet.create({
  container: {
    paddingHorizontal: 12,
    backgroundColor: Color.transparent,
  },
  text: {
    color: Color.white,
    fontSize: FontSize.SIZE_16,
    backgroundColor: Color.transparent,
  },
});
export default TitleBarText;
